// 预售首页
var datas1 = [{
    src: "../commImg/yushou-1nanzhuang.jpg",
    title: "马克华菲长袖T恤男士圆领修身韩版刺绣纯棉2017春装新款潮t 7002 立体3D绣花 欧美潮流范 17春装新品",
    pricelow: "¥128.00",
    price: "¥153.60",
    count: "1",
    time: '已结束',
}];


// 预售23数据
var datas2 = [{
    src: "../commImg/xiaoshuiguo-01-1.jpg",
    title: "一都枇杷新鲜水果特等级",
    pricelow: "49.90",
    btn: "预售已结束",
    count: "0",
    time: '已结束',
    type: '食品生鲜',
    con: '全部',


}, {
    src: "../commImg/yushou-1nanzhuang.jpg",
    title: "马克华菲长袖T恤男士圆领修身韩版刺绣纯棉2017春装新款潮t 7002 立体3D绣花 欧美潮流范 17春装新品",
    pricelow: "128.00",
    btn: "立即预约",
    count: "7",
    type: '家居家装',
    con: '全部',
    // time: '已结束',
}, {
    src: "../commImg/yushoubaoshi.jpg",
    title: "一叶子晚安睡眠面膜补水保湿深层清洁免洗冻膜专柜正品女化妆品 诺丽果冻膜 补水保湿",
    pricelow: "50.00",
    btn: "预售已结束",
    count: "6",
    time: '已结束',
    type: '手机通讯',
    con: '全部',
}, {
    src: "../commImg/zhuoziyouce-01-02.jpg",
    title: "特大号加厚塑料收纳箱整理箱有盖收纳盒衣服被子置物周转储物箱子",
    pricelow: "200.00",
    btn: "预售已结束",
    count: "6",
    time: '已结束',
    type: '',
    type: '家居家装',
    con: '全部',
}, {
    src: "../commImg/zhuozitui.-1-01.jpg",
    title: "歌梵 床头柜 地中海美式乡村蓝色田园床边柜 储物卧室家具 品质保障 用料环保 质保5年--不单卖",
    pricelow: "200.00",
    btn: "预售已结束",
    count: "15",
    time: '已结束',
    type: '家居家装',
    con: '全部',
}];


$(function () {

    function showData(data) {
        console.log(data);
        var rels = [];
        data.forEach(function (item) {
            rels.push(`
				<li>
				    <div class="p-warp">
				        <div class="p-img">
				            <a href="" target="_blank">
				                <img src="${item.src}" width="196" height="196">
				            </a>
				        </div>
				        <div class="p-info">
				            <div class="p-name">
				                <a href="" target="_blank">${item.title}</a>
				            </div>
				            <div class="p-item">
				                <div class="p-price">${item.pricelow}</div>
				                <div class="appointment">
				                    已有<em>${item.count}</em>人预约
				                </div>
				            </div>
				            <div class="p-dibu">
				                <a class="btn">${item.btn}</a>
				            </div>
				        </div>
				    </div>
				</li>
			`);
        });
        $('.preSaleNewProduct-s ul').html('');
        rels.forEach(function (item, i) {
            if (i < 2) {
                $('.preSaleNewProduct-s ul').eq(0).append(item);
            } else {
                if (i === 2) {
                    $('.preSaleNewProduct-s ul').eq(1).append(item);
                }
                if (i === 3) {
                    $('.preSaleNewProduct-s ul').eq(2).append(item);
                }
                if (i === 4) {
                    $('.preSaleNewProduct-s ul').eq(3).append(item);
                }
            }

        });


    }

    showData(datas2);
    // 点击第1个
    $(".dianji1").click(function () {
        console.log(7777);
        var tempArr = datas2.filter(function (item) {
            if (item.type === '智能娱乐') {
                return item;
            } else {
                $(".no_records").show();
            }
        });
        showData(tempArr);
    });
    // 点击第二个
    $(".dianji2").click(function () {
        console.log(7777);
        var tempArr = datas2.filter(function (item) {
            if (item.type === '手机通讯') {
                return item;
            }
        });
        showData(tempArr);
    });
    // 点击第三个
    $(".dianji3").click(function () {
        console.log(7777);
        var tempArr = datas2.filter(function (item) {
            if (item.type === '电脑数码') {
                return item;
            }
        });
        showData(tempArr);
    });
    // 点击第四个
    $(".dianji4").click(function () {
        console.log(7777);
        var tempArr = datas2.filter(function (item) {
            if (item.type === '家用电器') {
                return item;
            }
        });
        showData(tempArr);
    });
    // 点击第五个
    $(".dianji5").click(function () {
        console.log(7777);
        var tempArr = datas2.filter(function (item) {
            if (item.type === '家居家装') {
                return item;
            }
        });
        showData(tempArr);
    });
    // 点击第六个
    $(".dianji6").click(function () {
        console.log(7777);
        var tempArr = datas2.filter(function (item) {
            if (item.type === '食品生鲜') {
                return item;
            }
        });
        showData(tempArr);
    });
    // 点击第七个
    $(".dianji7").click(function () {
        console.log(7777);
        var tempArr = datas2.filter(function (item) {
            if (item.type === '图书音像') {
                return item;
            }
        });
        showData(tempArr);
    });


    // 即将开始


    // 全部
    $(".jijiang").click(function () {
        console.log(7777);
        var tempArr = datas2.filter(function (item) {
            if (item.con === '全部') {
                return item;
            }
        });
        showData(tempArr);
    });
    // 点击第1个

    $(".jijiang1").click(function () {
        console.log(7777);
        var tempArr = datas2.filter(function (item) {
            if (item.btn === '') {
                return item;
            }
        });
        showData(tempArr);
    });
    // 点击第2个
    $(".jijiang2").click(function () {
        console.log(7777);
        var tempArr = datas2.filter(function (item) {
            if (item.btn === '立即预约') {
                return item;
            }
        });
        showData(tempArr);
    });
    // 点击第3个
    $(".jijiang3").click(function () {
        console.log(7777);
        var tempArr = datas2.filter(function (item) {
            if (item.btn === '预售已结束') {
                return item;
            } else {
                $(".no_records").hide();
            }
        });
        showData(tempArr);
    });
})


// 第三个页面
$(function () {

    function showData(data) {
        console.log(data);
        var rels = [];
        data.forEach(function (item) {
            rels.push(`
				<li>
					<div class="s-warp-s">
						<div class="p-img-s">
							<a href="" target="_blank">
								<img src="${item.src}" width="196" height="196">
							</a>
						</div>
						<div class="p-price-s">
							<span>￥${item.pricelow}</span>
							<del></del>
						</div>
						<div class="p-name-s">
							<a href="" target="_blank">${item.title}</a>
						</div>
						<div class="p-info-s">
							<div class="p-left-s">
								<div class="time" data-time="2020-06-16 15:34:11">
									${item.time}
								</div>
								<div class="appointment">已有<em>${item.count}</em>人预约</div>
							</div>
						</div>
					</div>
				</li>
			`);
        });
        $('.special-product-s ul').html('');
        rels.forEach(function (item, i) {
            if (i < 5) {
                $('.special-product-s ul').eq(0).append(item);
            } else {
                if (i === 2) {
                    $('.special-product-s').eq(1).append(item);
                }
                if (i === 3) {
                    $('.special-product-s').eq(2).append(item);
                }
                if (i === 4) {
                    $('.special-product-s').eq(3).append(item);
                }
            }

        });


    }

    showData(datas2);
    // 点击第1个
    $(".dianji1").click(function () {
        console.log(7777);
        var tempArr = datas2.filter(function (item) {
            if (item.type === '智能娱乐') {
                // $(".no_records").show();
                // return item;
            } else {
                $(".no_records").show();
            }
        });
        showData(tempArr);
    });
    // 点击第二个
    $(".dianji2").click(function () {
        console.log(7777);
        var tempArr = datas2.filter(function (item) {
            if (item.type === '手机通讯') {
                return item;
            } else {
                $(".no_records").hide();
            }
        });
        showData(tempArr);
    });
    // 点击第三个
    $(".dianji3").click(function () {
        console.log(7777);
        var tempArr = datas2.filter(function (item) {
            if (item.type === '电脑数码') {
                return item;
            } else {
                $(".no_records").show();
            }
        });
        showData(tempArr);
    });
    // 点击第四个
    $(".dianji4").click(function () {
        console.log(7777);
        var tempArr = datas2.filter(function (item) {
            if (item.type === '家用电器') {
                return item;
            } else {
                $(".no_records").show();
            }
        });
        showData(tempArr);
    });
    // 点击第五个
    $(".dianji5").click(function () {
        console.log(7777);
        var tempArr = datas2.filter(function (item) {
            if (item.type === '家居家装') {
                return item;
            } else {
                $(".no_records").hide();
            }
        });
        showData(tempArr);
    });
    // 点击第六个
    $(".dianji6").click(function () {
        console.log(7777);
        var tempArr = datas2.filter(function (item) {
            if (item.type === '食品生鲜') {
                return item;
            }
        });
        showData(tempArr);
    });
    // 点击第七个
    $(".dianji7").click(function () {
        console.log(7777);
        var tempArr = datas2.filter(function (item) {
            if (item.type === '') {
                return item;
            } else {
                $(".no_records").show();
            }
        });
        showData(tempArr);
    });


    // 即将开始


    // 全部
    $(".jijiang").click(function () {
        console.log(7777);
        var tempArr = datas2.filter(function (item) {
            if (item.con === '全部') {
                return item;
            }
        });
        showData(tempArr);
    });
    // 点击第1个

    $(".jijiang1").click(function () {
        console.log(7777);
        var tempArr = datas2.filter(function (item) {
            if (item.btn === '') {
                return item;
            }
        });
        showData(tempArr);
    });
    // 点击第2个
    $(".jijiang2").click(function () {
        console.log(7777);
        var tempArr = datas2.filter(function (item) {
            if (item.btn === '立即预约') {
                return item;
            }
        });
        showData(tempArr);
    });
    // 点击第3个
    $(".jijiang3").click(function () {
        console.log(7777);
        var tempArr = datas2.filter(function (item) {
            if (item.btn === '预售已结束') {
                return item;
            }
        });
        showData(tempArr);
    });

    $(".font-red").click(function () {
        console.log(7777);
        var tempArr = datas2.filter(function (item) {
            if (item.btn === '家居家装') {
                return item;
            } else {
                $(".no_records").show();
            }
        });
        showData(tempArr);
    });

});


// 排序

$(function () {
    function paixuz(data, ele) {
        // 临时存储源数据
        // console.log(7448);
        console.log(data);
        // let tempData = data.concat();
        // console.log(tempData);
        // 使用sort方法实现数据排序
        // $('.special-product-s ul').empty('');
        data.sort((a, b) => Number(b[ele]) - Number(a[ele]));
        // console.log(4777777777);
        // $('.special-product-s ul').html('');
        return data;
    };

    $(function () {
        var qe = $(".gd").click(function () {
            console.log(qe);
            console.log(88888888);

            // showData(datas2);
            paixuz(datas2, "pricelow") //排序封装
            // showData(datas2);  //渲染的数据
        });
        // showData(datas2);  //渲染的数据
    })
    showData(datas2); //渲染的数据
})


// ------------

$(function () {
    $(".btn").mouseover(function () {
        console.log(123);
        $(this).siblings("btn").css("backgroundColor", "")
        $(this).css("backgroundColor", "#EC5051");
        $(this).css("color", "#ffffff")
        ;
    });
});
$(function () {
    $(".btn").mouseout(function () {
        console.log(123);
        $(this).siblings("btn").css("backgroundColor", "")
        $(this).css("backgroundColor", "");
        $(this).css("color", "#EC5051");
    });
});
// -----------------
